<!-- 我发布的 -->
<template>
	<view>
		<view class="p-3">
			<u-search
				placeholder="搜索"
				placeholder-color="#86909c"
				bg-color="#fff"
				@search="searchKeyFn"
				v-model="projectName"
				:show-action="false"
			></u-search>
		</view>
		<view v-if="navCurrent == 0" class=" d-flex a-center px-3 j-start">
			<view
				class="rounded bg-write text-main u-m-r-14 px-1 py-1 font "
				v-for="(item, index) in followUpList"
				:key="index"
				:class="[{ 'active-class': activeIndex == item.value }]"
				@click="toggleActive(item.value)"
			>
				{{ item.label }}
			</view>
		</view>

		<view class=" px-3 d-flex">
			<!-- :style="{ color: color, fontWeight: fontWeight }" -->
			<view class="date" @click="acceptDatePickerFn" style="z-index: 99;">
				<view class="pr d-flex ">
					反馈时间
					<view class="d-flex flex-column pl-1">
						<view
							class="iconfont icon-shangjiantou "
							:class="changeColor ? 'text-primary' : 'text-success'"
							style="height: 20rpx; font-size: 22rpx; margin-top: -6rpx;"
						></view>
						<view
							class="iconfont icon-xiajiantou "
							:class="changeColor ? 'text-success' : 'text-primary'"
							style="height: 20rpx;font-size: 22rpx;margin-top: -6rpx;"
						></view>
					</view>
				</view>
			</view>
			<view class="operateBox">
				<u-dropdown>
					<u-dropdown-item
						v-model="rootInformationTag"
						:title="rootInformList[rootInformationTag].label"
						:options="rootInformList"
						@change="changeRootInformationEnumFn"
					></u-dropdown-item>
					<u-dropdown-item
						v-model="projectStage"
						:title="projectPhaseList[projectStage].label"
						:options="projectPhaseList"
						@change="changeProjectStageFn"
					></u-dropdown-item>
				</u-dropdown>
			</view>
		</view>

		<z-paging ref="paging" v-model="dataList" refresher-no-transform use-page-scroll @query="queryList">
			<view
				class="projectBox p-3 m-3 rounded-8 bg-write line-h-md text-l"
				v-for="(item, index) in dataList"
				:key="index"
				@click="projectDetailsFn(item)"
			>
				<view class="d-flex j-sb a-center">
					<view class="font text-h">反馈时间：{{ item.lastNewFeedbackDate }}</view>
					<!-- 已通过显示接收状态，未审核/未通过显示审核状态 -->
					<view class="bg-blue text-blue rounded px-2 py-1 font ">{{ item.lastNewFeedbackPhaseName }}</view>
				</view>
				<view class="font-lg text-main font-weight">{{ item.projectName }}</view>
				<view class="u-flex u-row-between">
					<view class="bg-grey  px-1 py text-primary font">{{ item.rootInformationTagName }}</view>
					<view class="text-primary font">
						<image
							class="imagesBox"
							mode="aspectFit"
							style="width: 46rpx ; height: 16rpx;"
							:src="getStaticFilePath('ico-jd.png')"
						></image>
						{{ item.projectStageName }}
					</view>
				</view>
				<view class="p-2 my-2 bg-grey rounded line-h-md">
					<view class="d-flex a-center">
						<view class="flex-1 ">
							<text class="text-tips font">信息类型：</text>
							<text class="text-main font ">{{ item.infoTypeName }}</text>
						</view>
						<view class="flex-1">
							<text class="text-tips font">预计产值规模：</text>
							<text class="text-main font ">{{ item.outputScale }}</text>
						</view>
					</view>
					<view class="d-flex a-center">
						<view class="flex-1">
							<text class="text-tips font">省份：</text>
							<text class="text-main font ">{{ item.province }}</text>
						</view>
						<view class="flex-1">
							<text class="text-tips font">城市：</text>
							<text class="text-main font ">{{ item.city }}</text>
						</view>
					</view>
					<view class="d-flex j-sb mt-2 a-center">
						<view class="d-flex a-center">
							<view class="iconfont icon-calendar-todo-fill text-primary"></view>
							<view class="text-main font ml-1">{{ item.projectAddressName }}</view>
						</view>
					</view>
				</view>
				<view class="listBnt d-flex j-end">
					<button class="errorListBnt btn-cancel" @click.stop="hanglgFeedbackFn(item)">反馈</button>
				</view>
			</view>
		</z-paging>
	</view>
</template>

<script>
import { busInfoTrackPageList } from '@/api/apis.js';
import { followUpList, rootInformList, projectPhaseList } from '@/utils/data.js';
export default {
	data() {
		return {
			projectName: '',
			followUpList,
			activeIndex: null,
			color: 'rgb(96, 98, 102)',
			iconColor: '#c0c4cc',
			fontWeight: 'normal',
			changeColor: false,
			rootInformList,
			projectPhaseList,
			projectStage: 4, //项目阶段
			rootInformationTag: 2, //信息源
			auditStatus: '2', //审核状态
			navCurrent: 0,
			dataList: [],
			navList: [
				{
					name: '已通过'
				},
				{
					name: '未审核'
				},
				{
					name: '未通过'
				}
			]
		};
	},
	options: {
		styleIsolation: 'shared' // 解除样式隔离
	},
	methods: {
		toggleActive(index) {
			if (this.activeIndex === index) {
				this.activeIndex = null;
			} else {
				this.activeIndex = index;
			}
			this.$refs.paging.reload();
		},
		queryList(pageNo, pageSize) {
			busInfoTrackPageList({
				page: pageNo,
				size: pageSize,
				feedbackPhase: this.activeIndex,
				feedbackDateSort: this.changeColor ? 'ASC' : 'DESC',
				rootInformationTag: this.rootInformationTag == 2 ? '' : this.rootInformationTag,
				projectStage: this.projectStage == 4 ? '' : this.projectStage,
				projectName: this.projectName
			}).then(res => {
				if (res.code == 10000) {
					this.$refs.paging.complete(res.data.data);
				} else {
					this.$refs.paging.complete(false);
				}
			});
		},
		//关键词搜索
		searchKeyFn(e) {
			this.$refs.paging.reload();
		},
		//点击反馈时间
		acceptDatePickerFn() {
			this.changeColor = !this.changeColor;
			this.color = this.changeColor ? '#4e5969' : '#606266';
			this.fontWeight = this.changeColor ? '700' : 'normal';
			this.iconColor = this.changeColor ? '#4e5969' : '#c0c4cc';
			this.$refs.paging.reload();
		},
		changeRootInformationEnumFn(e) {
			this.rootInformationTag = e;
			this.$refs.paging.reload();
		},
		//点击下拉选
		changeProjectStageFn(e) {
			this.projectStage = e;
			this.$refs.paging.reload();
		},
		//项目详情
		projectDetailsFn(item) {
			this.$Router.push({
				path: '/detailPages/pages/projectDetailsFeedbackSituation/index',
				// path: '/detailPages/pages/projectDetails/index',
				query: {
					busiInfoId: item.busiInfoId
				}
			});
		},

		//反馈
		hanglgFeedbackFn(item) {
			this.$Router.push({
				path: '/detailPages/pages/feedbackInformation/index',
				query: {
					busInfoTrackId: item.busInfoTrackId
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
::v-deep .u-content {
	height: 80rpx !important;
}
::v-deep .uicon-search {
	color: #0052d9 !important;
}
::v-deep .u-dropdown__menu__item__text ::after {
	font-family: 'iconfont';
	content: '\eb6d';
	padding-left: 10rpx;
	color: #0052d9;
	font-size: 20rpx;
}

::v-deep .u-dropdown__menu__item__arrow {
	display: none !important;
}

.operateBox {
	width: 310rpx;
}
.date {
	line-height: 80rpx;
	font-size: 28rpx;
}
.active-class {
	background-color: #0052d9;
	color: #fff;
}

::v-deep .u-dropdown__content {
	width: 750rpx !important;
	left: -170rpx !important;
}
</style>
